<template>
    <div
        class="text-[#fff] text-base  flex items-center justify-center h-7 box-border sticky top-[-1px] dark:bg-[#242424] bg-[#fff]">
        <m-svg-icon name="left" class="absolute left-1 t-[50%] w-2.5 h-2.5" @click="handleBack"></m-svg-icon>
        <div class="p-2" :class="{ 'border-red-600 border-b': item.value === activeIndex }"
            v-for="(item, index) in list" @click="handleClick(item)">{{ item.text }}</div>
    </div>
</template>
<script lang="ts" setup>
import router from '@/router';
import { ref } from 'vue'
import { inject } from 'vue'
const ISBN = inject('ISBN')

defineProps({
    activeIndex: {
        required: true
    }
})
const emits = defineEmits(['update:activeIndex'])

const list = [{ text: '详情', value: 1 }, { text: '评论', value: 2 }, { text: '相关', value: 3 }]
const handleClick = (item: any) => {
    emits('update:activeIndex', item.value)
}
const handleBack = () => {
    router.back()
}
</script>
<style lang="scss" scoped></style>